<template>
  <div class="content">
    <h3 class="user-title">{{title}}</h3>
    <div class="user-pass-type">
      <div class="user-pass-item" @click="$router.push({path:routerPath,query:{type:'mobile'}})">
        <h3>{{'VERIF_MOBILE'|t}}</h3>
        <p>{{'VERIF_MOBILE_DESC'|t}}</p>
      </div>
      <div class="user-pass-item" @click="$router.push({path:routerPath,query:{type:'email'}})">
        <h3>{{'VERIF_EMAIL'|t}}</h3>
        <p>{{'VERIF_EMAIL_DESC'|t}}</p>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'zx-user-auth',
    props: {
      title: {
        type: String,
        default: 'Here is a title.'
      },
      routerPath: {
        type: String,
        default: '/'
      }
    }
  };
</script>
<style lang="scss" scoped>
  @import "../assets/sass/user.scss";
</style>